<{include file="public/header.html"}> 
<script src="/static/public/jquery.pagination.js" type="text/javascript" charset="utf-8"></script>
		<div class="credit-main w1180-con mt20">
			<div class="mb20" style="height: 193px; background: url(<{$style_dir}>/img/introduce/4.jpg) no-repeat center 0;"></div>
			<div class="credit-card" style="border: 1px dashed #ccc;">
				<div class="credit-card-type">
					<!--信用卡--银行分类-->
	                                <{if $bank_type}>
					<div class="credit-classify credit-classify-more clear">
	                                    <p><{$bank_type['title']}>：</p><a href='javascript:void(0);' class="credit-selected hover-style" data-id="0">不限</a>
						<ul>
	                                            <{foreach from=$bank_type['children'] item=val}>
	                                            <li><a href='javascript:void(0);' class="hovering" data-id="<{$val['id']}>"><{$val['title']}></a></li>
	                                            <{/foreach}>
						</ul>
						<div class="clear"></div>
					</div>
	                                <{/if}>
					<!--信用卡---用途-->
	                                <{if $use_type}>
					<div class="credit-classify credit-use clear">
						<p><{$use_type['title']}>：</p><a href='javascript:void(0);' class="credit-selected hover-style" data-id="0">不限</a>
						<ul>
	                                            <{foreach from=$use_type['children'] item=val}>
							<li><a href='javascript:void(0);' class="hovering" data-id="<{$val['id']}>"><{$val['title']}></a></li>
	                                            <{/foreach}>
						</ul>
						<div class="clear"></div>
					</div>	
	                                <{/if}>
					<!--信用卡---等级-->
	                                <{if $degree_type}>
					<div class="credit-classify credit-level clear">
						<p><{$degree_type['title']}>：</p><a href='javascript:void(0);' class="credit-selected hover-style" data-id="0">不限</a>
						<ul>
	                                            <{foreach from=$degree_type['children'] item=val}>
							<li><a href='javascript:void(0);' class="hovering" data-id="<{$val['id']}>"><{$val['title']}></a></li>
	                                            <{/foreach}>
						</ul>
						<div class="clear"></div>
					</div>	
	                                <{/if}>
				</div>	
				<div class="credit-card-type2">
					<!--信用卡---币种-->
	                                <{if $coin_type}>
					<div class="credit-classify credit-currency clear">
						<p><{$coin_type['title']}>：</p><a href='javascript:void(0);' class="credit-selected hover-style" data-id="0">不限</a>
						<ul>
	                                            <{foreach from=$coin_type['children'] item=val}>
							<li><a href='javascript:void(0);' class="hovering" data-id="<{$val['id']}>"><{$val['title']}></a></li>
	                                            <{/foreach}>
						</ul>
						<div class="clear"></div>
					</div>	
	                                <{/if}>
					<!--信用卡---组织-->
	                                <{if $organ_type}>
					<div class="credit-classify credit-organize clear">
						<p><{$organ_type['title']}>：</p><a href='javascript:void(0);' class="credit-selected hover-style" data-id="0">不限</a>
						<ul>
	                                            <{foreach from=$organ_type['children'] item=val}>
	                                            <li><a href='javascript:void(0);' class="hovering" data-id="<{$val['id']}>"><{$val['title']}></a></li>
	                                            <{/foreach}>
						</ul>
						<div class="clear"></div>
					</div>
	                                <{/if}>
				</div>	
			</div>
			<div class="drop-down"><b class="icon-open-close icon-open"></b></div>
			<div class="clear"></div>
			<!--信用卡列表-->
			<div class="credit-card-list">
				
			</div>	
                        <div class="holder" id="credit_pagination"></div>
		</div>
		
		<script type="text/javascript">
                    
                    function showCreditInfo(ID){
                        var params = {};
                        params.id = ID;
                        doRequest("/card/info.html",params,false,function(data){$("body").find(".popup-credit,.popup-credit-sign").remove().end().append(data.data);},errorCallback);
                    }
                    
                    function successLoadCredit(resp){
                        var totalCount = resp.data.totalCount;
                        var str = "";
                        if(totalCount == 0){
                            str += "<div class='no-card'><b class='icon icon-hasno'></b>没有找到符合您筛选条件的信用卡，您可以重新选择!</div>";
                        }
                        var list = resp.data.list;
                        $.each(list,function(index,data){
                            str +=  data.str;
                        });
                        
                        $(".credit-card-list").html(str);
                        creditPage(totalCount,resp.data.pageIndex);
                    }
                    function loadCredit(pageIndex){
                        var obj = $(".credit-classify .hover-style");
                        var str = "";
                        obj.each(function(){
                            str += $(this).attr("data-id")+",";
                        });
                        str = str.substr(0,str.length-1);
                        var params = {};
                        params.type = str;
                        params.pageIndex = pageIndex;
                        doRequest("/card/mlist.html",params,false,successLoadCredit,errorCallback);
                    }
                    
                    function creditPage(total,pageIndex){
                        $("#credit_pagination").pagination(total, { //recordCount在后台定义的一个公有变量，通过从数据库查询记录进行赋值，返回记录的总数
                        callback: loadCredit,  //点击分页时，调用的回调函数
                        prev_text: '<',  //显示上一页按钮的文本
                        next_text: '>',  //显示下一页按钮的文本
                        link_to:"javascript:void(0);",
                        items_per_page:5,  //每页显示的项数
                        num_display_entries:6,  //分页插件中间显示的按钮数目
                        current_page:pageIndex,  //当前页索引
                        num_edge_entries:2  //分页插件左右两边显示的按钮数目
                        });
                    }
                    
		/**
		 * credit-card detail 弹窗
		 * */
		$("body").delegate('.popup-credit-sign .icon-close','click',function(){
				$(this).parents('.popup-credit-sign').fadeOut();
				$('.popup-credit').fadeOut();
			});
                $("body").delegate('.popup-credit-sign .tab span','click',function(){
                        index = $(this).parent().children().index($(this));
                        $('.popup-credit-sign .credit-con .credit-txt').eq(index).fadeIn().siblings().hide();
                        $(this).addClass('popup-credit-line').siblings().removeClass('popup-credit-line');
                });
		/**
		 * credit-card 类别 click effect
		 * */				
			$(function(){
                            loadCredit(0);
				var obj=$(".credit-classify.clear");
				obj.each(function()
				{
					var _this=this;
					$( "li a,.credit-selected.hover-style",this).click(function()
					{
						$( "li a,.credit-selected.hover-style",_this).removeClass("hover-style")
						$(this).addClass("hover-style");
						$(this).removeClass("hovering");
                                                
                                                loadCredit(0);
					})
				})
			});
			
			
		</script>
		<!--footer-->
		<{include file="public/footer.html"}> 